﻿@model Dominar.Modelos.RegistrarModel
<script type="text/javascript">
    $(document).ready(function () {
        $(".imagenCargando").hide();
        $("#resultadoNoDisponible").hide();
        $("#pasoDos").hide();

        EventBinder($("#pasoUnoSiguiente"), "click", procesarPasoUno);
    });

    function procesarPasoUno() {
        $(".imagenCargando").show();
        $("#dominioBuscar").prop("disabled", true);
        $("#regiones").prop("disabled", true);
        $("#pasoUnoSiguiente").prop("disabled", true);
        
        $.ajax({
            url: '@Url.Content("~/Home/Consultar")',
            data: { dominio: $("#dominioBuscar").val(), idRegion: $("#regiones").val() },
            success: function (data) {
                $(".imagenCargando").hide();
                $("#dominioBuscar").prop("disabled", false);
                $("#regiones").prop("disabled", false);
                $("#pasoUnoSiguiente").prop("disabled", false);
                $("#resultadoNoDisponible").hide();

                if (data.Disponible == true) {
                    $("#resultadoNoDisponible").hide();
                    cargarPasoDos();
                }
                else {
                    $("#resultadoNoDisponible").show();
                }
            },
            error: function () {
                $(".imagenCargando").hide();
                $("#dominioBuscar").prop("disabled", false);
                $("#regiones").prop("disabled", false);
                $("#pasoUnoSiguiente").prop("disabled", false);
            }
        });
    }

    function cargarPasoDos() {
        $("#pasoUno").hide();
        $("#pasoDos").show();
    }
</script>
<div class="row">
    <div class="col-md-1">
        <img src="@Url.Content("~/Contenido/Imagenes/planetita.png")" />
    </div>
    <div class="col-md-8">
        <label class="tituloPrincipal">Registrando un Dominio</label>
    </div>
</div>
<div class="contenedorAsistenteDominio">
    <div id="pasoUno">
        <div class="row cabeceraPaso">
            <div class="col-md-1">
                <div class="itemPaso">
                    1
                </div>
            </div>
            <div class="col-md-5 cabeceraPasoTexto">
                <label class="cabeceraPasoTextoPija">Elegi tu nombre de Dominio</label>
            </div>
        </div>
        <div class="row cabeceraPaso">
            <label class="col-md-1 col-md-offset-1 httpTexto">http://www.</label>
            <div class="col-md-6">
                <input id="dominioBuscar" type="text" class="form-control" />
            </div>
            <div class="col-md-2">
                <select id="regiones" class="form-control elementosDominios">
                    @foreach (BLLDominar.DA_Region item in Model.Regiones)
                    {
                        <option value="@item.IdRegion">@item.Region</option>
                    }
                </select>
            </div>
        </div>
        <div class="row cabeceraPaso">
            <div class="col-md-offset-1 col-md-11">
                <button id="pasoUnoSiguiente" class="btn btn-primary">Siguiente</button>
                <img class="imagenCargando" src="~/Contenido/Imagenes/loading2.gif" />
                <label id="resultadoNoDisponible" class="text-danger">El dominio NO está disponible</label>
            </div>
        </div>
    </div>
    <div id="pasoDos">
        <div class="row cabeceraPaso">
            <div class="col-md-1">
                <div class="itemPaso">
                    2
                </div>
            </div>
            <div class="col-md-5 cabeceraPasoTexto">
                <label class="cabeceraPasoTextoPija">Confirmar Solicitud</label>
            </div>
        </div>
        <div class="row cabeceraPaso">
            <div class="col-md-offset-1 col-md-11">
                <p class="parrafo">¡Genial! Tu dominio está disponible, solo resta un paso más.</p>
                <p class="parrafo">El costo de cada domino es de <b>$@Model.Costo</b></p>
                <p class="parrafo"></p>
            </div>
        </div>
    </div>
</div>

